<template>
	<div class="publicpageview">
		<div class="publicformview">
			<div class="headTop">
				<div class="xinxi">
					<el-button @click="selectButton(1)" :class="[type==1?'tabButton':'']" type="primary"
						size="mini">基本信息</el-button>
					<el-button @click="selectButton(2)" :class="[type==2?'tabButton':'']" type="primary"
						size="mini">设备</el-button>
					<el-button v-if='xinzhi=="住宅"' @click="selectButton(3)" :class="[type==3?'tabButton':'']" type="primary"
						size="mini">住宅租金</el-button>
					<el-button v-if='xinzhi=="非住宅"' @click="selectButton(4)" :class="[type==4?'tabButton':'']" type="primary"
						size="mini">非住宅租金</el-button>
					<el-button @click="selectButton(5)" :class="[type==5?'tabButton':'']" type="primary"
						size="mini">历年租金</el-button>
				</div>
				<el-button type="primary" size="mini" @click="returns">返回</el-button>
			</div>
		</div>

		<jibenxinxi v-if="type==1" :blockType='blockType' :roomid='roomid' @xinzhi='xinzhiChange'></jibenxinxi>
		<shebei v-if="type==2" :blockType='blockType' :roomid='roomid'></shebei>
		<zhuzaizujing v-if="type==3" :blockType='blockType' :roomid='roomid'></zhuzaizujing>
		<feizhuzaizujing v-if="type==4" :blockType='blockType' :roomid='roomid'></feizhuzaizujing>
		<linianzujin v-if="type==5" :blockType='blockType' :roomid='roomid'></linianzujin>
		

	</div>
</template>

<script>
	import jibenxinxi from './fangjianComponents/jibenxinxi.vue'
	import shebei from './fangjianComponents/shebei.vue'
	import zhuzaizujing from './fangjianComponents/zhuzaizujing.vue'
	import feizhuzaizujing from './fangjianComponents/feizhuzaizujing.vue'
	import linianzujin from './fangjianComponents/linianzujin.vue'
	export default {
		name: "AccommodationManagementSuoziliaoluru",
		components:{
			jibenxinxi,
			shebei,
			zhuzaizujing,
			feizhuzaizujing,
			linianzujin
		},
		data() {
			return {
				listQuery: {
					page: 1,
					limit: 20,
					keyword: "",
					mobile: "",
					status: "1",
					time: ""
				},
				total: 0,
				options: [{
					key: "1"
				}],
				listLoading: false,
				dialogVisible: false,
				isChanquan: true,
				type: '',
				roomid:'',
				blockType:'',
				xinzhi:''
			};
		},

		computed: {
		},

		mounted() {
			
				if(this.$route.query){
					this.roomid = this.$route.query.roomid
					this.blockType = this.$route.query.type
				}
			this.type = 1
		},

		methods: {
			resetForm(val) {
				console.log("1");
				this.$refs[val].resetFields();
			},
			handleAddUser(type) {
				this.isChanquan = type == 1 ? true : false
			},
			returns() {
				this.$router.go(-1)
			},
			// 选择类型
			selectButton(type) {
				this.type = type
			},
			xinzhiChange(e){
				console.log(e)
				this.xinzhi = e
			}
		},
	};
</script>
<style scoped>
	.headTop {
		width: 100%;
		display: flex;
		justify-content: space-between;

		.xinxi {
			display: flex;
			width: 800px;
		}
	}

	.el-form-item {
		justify-content: start !important;
	}

	.el-select {
		width: 180px;
	}

	.el-input {
		width: 180px;
	}

	.el-date-picker {
		width: 180px;
	}

	.bottomTop {
		width: 100%;
		display: flex;
		justify-content: end;
	}

	.tabButton {
		background: #EFF2F7;
		color: #333333;
		border: none;
	}
</style>